<!--计时器-->
<template>
    <span class="timer">
        <svg-icon icon-class="clock" class="font20 mr10"></svg-icon>
        <span class="date">{{ date }}</span>
        <span v-if="showWeek" class="ml5">{{ week }}</span>
        <span class="time ml20">{{ time }}</span>
    </span>
</template>

<script>
export default {
    name: 'timer',
    props: {
        showWeek: {
            type: Boolean,
            default: false,
        },
    },
    data() {
        return {
            date: new Date(),
            time: '10:29',
            week: '',
        }
    },
    mounted() {
        this.showCurrentWeek()
        this.currentTime()
    },
    methods: {
        currentTime() {
            setInterval(this.getTime, 500)
        },
        showCurrentWeek() {
            const a = new Array('日', '一', '二', '三', '四', '五', '六')
            const week = new Date().getDay()
            this.week = `星期${a[week]}`
        },
        getTime() {
            let yy = new Date().getFullYear()
            let mm = new Date().getMonth() + 1
            let dd = new Date().getDate()
            this.date = yy + '年 ' + mm + '月' + dd + '日 '
            let hh = new Date().getHours()
            let mf = new Date().getMinutes() < 10 ? '0' + new Date().getMinutes() : new Date().getMinutes()
            let ss = new Date().getSeconds() < 10 ? '0' + new Date().getSeconds() : new Date().getSeconds()
            this.time = hh + ':' + mf + ':' + ss
        },
    },
}
</script>

<style scoped>
.timer {
    font-size: 14px;
    font-family: AlibabaPuHuiTiR;
}
</style>
